import { createVNode, render } from 'vue'
import FileUpload from "@/components/Upload/FileUpload.vue";

/**
 * 上传文件配置
 */
export class FileUploadConfig {
    /**
     * 文件限制总数量
     */
    fileNum?: number = 1;

    /**
     * 文件大小限制 单位 字节 B 默认300KB
     */
    fileSize?: number = 300 * 1024;

    /**
     * 允许一次性上传多张图片 默认1
     */
    multiple?: number = 1;
}


export default {
    install(app: any) {

        /**
         * 上传文件
         * @param config 
         * @param success 
         */
        function fileUploadPlugin(config: FileUploadConfig = new FileUploadConfig(), success: (url: string[]) => void) {
            let dom = document.createElement("div");
            dom.id = "file_upload";
            document.body.appendChild(dom);

            let _config: any = {
                fileNum: config.fileNum,
                fileSize: config.fileSize,
                multiple: config.multiple,
                accept: {
                    type: Object,
                    default: {
                        title: 'Images',
                        extensions: 'gif,jpg,jpeg,bmp,png',
                        mimeTypes: 'image/*'
                    }
                }
            };

            _config["opend"] = true;
            _config["getContainer"] = dom;
            _config["onEnd"] = () => {
                dom.remove();
            }
            _config["onSuccess"] = (url: string[]) => {
                success(url);
            }

            let vm = createVNode(FileUpload, _config);
            vm.appContext = app._context;
            render(vm, dom);
        }

        app.config.globalProperties.$FileUpload = fileUploadPlugin
    }
}


/**
 * 文件上传
 */
// export class FileUploadService {

//     /**
//      * 上传文件
//      * @param config 配置
//      * @param success 上传成功后回调参数
//      */
//     static Upload(config: FileUploadConfig = new FileUploadConfig(), success: (url: string[]) => void) {
//         let dom = document.createElement("div");
//         dom.id = "file_upload";
//         document.body.appendChild(dom);

//         let _config: any = {
//             fileNum: config.fileNum,
//             fileSize: config.fileSize,
//             multiple: config.multiple,
//             accept: {
//                 type: Object,
//                 default: {
//                     title: 'Images',
//                     extensions: 'gif,jpg,jpeg,bmp,png',
//                     mimeTypes: 'image/*'
//                 }
//             }
//         };

//         _config["opend"] = true;
//         _config["getContainer"] = dom;
//         _config["onEnd"] = () => {
//             dom.remove();
//         }
//         _config["onSuccess"] = (url: string[]) => {
//             success(url);
//         }

//         let vm = createVNode(FileUpload, _config);
//         // vm.appContext = app._context;
//         render(vm, dom);
//     }
// }